<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <!-- 引入bootstrap文件 -->
  <link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css">
  <!--[if lt IE 9]>
      <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]-->
  <!-- 引入自己的样式 -->
  <link rel="stylesheet" href="/css/index.css">
</head>

<body>
  <div class="container">
    <div class="row">
      <header class="col-md-2">
        <div class="logo">
          <a href="#"><img src="/images/m3.jpg" alt="" class="hidden-xs">
          </a>
            <span class="visible-xs">欢迎来到小喵咪馆</span>
       
        </div>
        <div class="nav">
          <ul>
            <li><a href="#" class="glyphicon glyphicon-gift">猫猫馆</a></li>
            <li><a href="#" class="glyphicon glyphicon-briefcase">看脸馆</a></li>
            <li><a href="#" class="glyphicon glyphicon-hand-right">百秀馆</a></li>
            <li><a href="#" class="glyphicon glyphicon-question-sign">憨憨馆</a></li>
            <li><a href="#" class="glyphicon glyphicon-pawn">小鱼儿馆</a></li>
          </ul>
        </div>
      </header>
      <article class="col-md-7">
        <!-- 新闻部分 -->
        <div class="news clearfix">
          <ul>
            <li><a href="#">
                <img src="./images/m4.jpg" alt="">
                <p>情侣喵喵</p>
              </a></li>
            <li>
              <a href="#">
                <img src="./images/m5.jpg" alt="">
              </a>
            </li>
            <li>
              <a href="#">
                <img src="./images/m2.jpg" alt="">
              </a>
            </li>
            <li>
              <a href="#">
                <img src="./images/m6.jpg" alt="">
              </a>
            </li>
            <li>
              <a href="#">
                <img src="./images/m7.jpg" alt="">
              </a>
            </li>
          </ul>
        </div>
        <div class="publish">
          <div class="row">
            <div class="col-sm-9">
              <h3>您了解过崽崽的习惯吗</h3>
              <p class="text-muted">小鱼儿发布 2021-10-13</p>
              <p>你不知道的事：我家憨憨是个大笨蛋，虽然他很厉害，可是不会哄小宝贝</p>
            </div>
            <div class="col-sm-3 pic">
              <img src="./images/m8.jpg" alt="">
            </div>
          </div>
          <div class="row">
            <div class="col-sm-9">
              <h3>你喜欢崽崽吗</h3>
              <p class="text-muted">小鱼儿发布 2021-10-13</p>
              <p>你不知道的事：我家憨憨是个大笨蛋，虽然他很厉害，可是不会哄小宝贝</p>
            </div>
            <div class="col-sm-3 pic">
              <img src="./images/m9.jpg" alt="">
            </div>
          </div>
          <div class="row">
            <div class="col-sm-9">
              <h3>你肯定不喜欢，不然为啥不哄</h3>
              <p class="text-muted">小鱼儿发布 2021-10-13</p>
              <p>你不知道的事：我家憨憨是个大笨蛋，虽然他很厉害，可是不会哄小宝贝</p>
            </div>
            <div class="col-sm-3 pic">
              <img src="./images/p4.gif" alt="">
            </div>
          </div>
          <div class="row">
            <div class="col-sm-9">
              <h3>那我是不是猜对了</h3>
              <p class="text-muted">小鱼儿发布 2021-10-13</p>
              <p>你不知道的事：我家憨憨是个大笨蛋，虽然他很厉害，可是不会哄小宝贝</p>
            </div>
            <div class="col-sm-3 pic">
              <img src="./images/p2.jpg" alt="">
            </div>
          </div>
        </div>

      </article>
      <aside class="col-md-3">
        <div class="navv">
          <a href="#">
            <img src="./images/nav.jpg" alt="">
          </a>
        </div>
        <div class="hoot">
          <a href="#">
            <span class="btn btn-primary hot">热搜</span>
          </a>
          <h5 class="text-danger">看完了吧，我就知道你不会认真看，哼哼唧唧</h5>
          <p>不过今天宝贝终于不会因为offer的事情气我了，但是....</p>
        </div>



      </aside>
    </div>
  </div>
</body>

</html>